<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>新详情</title>
  <link rel="stylesheet" type="text/css" href="./css/test03.css">
<!--  <script src="plugin/echarts-4.9.0/echarts.all.js"></script>-->
<!--  <script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js"></script>-->
<!--  <script src="http://echarts.baidu.com/build/dist/echarts.js"></script>-->
  <script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js"></script>
  <script src="js/test03.js"></script>
</head>
<body>
<div class="cockpit-region-maker">
  <div class="region-maker-board" id="test">
    <div class="maker-board-name">临安啊啊</div>
  </div>
  <div class="region-maker-point">
    <div class="region-maker-line"></div>
    <div class="region-maker-circle">
      <div class="maker-circle01"></div>
      <div class="maker-circle02"></div>
    </div>
  </div>
</div>
<br>
<div class="cockpit-region-maker">
  <div class="region-maker-board">
    <div class="maker-board-name">临安区</div>
    <div class="maker-board-group" id="临安区_事">
      事&nbsp<span>2</span>
    </div>
    <div class="maker-board-group" id="临安区_散">
      散&nbsp<span>2</span>
    </div>
    <div class="maker-board-group" id="临安区_滞">
      滞&nbsp<span>2</span>
    </div>
    <div class="maker-board-group" id="临安区_超">
      超&nbsp<span>2</span>
    </div>
    <div class="maker-board-group" id="临安区_次">
      次&nbsp<span>2</span>
    </div>
  </div>
  <div class="region-maker-point">
    <div class="region-maker-line"></div>
    <div class="region-maker-circle">
      <div class="maker-circle01"></div>
      <div class="maker-circle02"></div>
    </div>
  </div>
</div>





<br>
<div class="regulation-circle-contain">
   <div class="regulation-circle01"></div>
    <div class="regulation-circle02"></div>
    <div class="regulation-circleRank">07</div>
</div>
<br>
<div class="regulation-circle-contain">
  <div class="regulation-circle01"></div>
  <div class="regulation-circle02">


  </div>
</div>

<br>

<div class="siteDetail-main">
  <div class="siteDetail-info">
    <div class="siteDetail-name">饮用水</div>
    <div style="display: none">劣Ⅳ类</div>
  </div>
  <div class="siteDetail-icon">
    <img src="images/饮用水水质站.svg">
  </div>
  <div class="siteDetail-arrow">  </div>
</div>

<div class="siteDetail-circle-contain">
  <i class="siteDetail-static-circle"></i>
  <i class="siteDetail-dynamic-circle01"></i>
  <i class="siteDetail-dynamic-circle02"></i>
</div>

<br>

<div>
  <div class="regulation-main">
    <div class="regulation-info">
      <div class="regulation-name">杨浦区</div>
      <div class="regulation-count">414</div>
    </div>
    <div id="regulationEchart" class="regulation-bar">
    </div>
  </div>
  <div class="regulation-arrow"></div>
</div>

<br>
<div id="main" style="width: 200px;height:20px;background-color: white;border: 1px solid red;padding: 4px"></div>

<button style="position: absolute;top: 0px;right: 0px" onclick="test()">测试</button>
</body>
<script>
  window.onload = function () {
    initEWchart();//Echart表格
  }
  function test(){
    console.log('test');

    let myDom = document.createElement("div");
    myDom.innerHTML = '<div class="maker-board-group">' +
      '散&nbsp<span style="color: rgba(255, 255, 255, 1)">2</span>' +
      '</div>' ;
    document.getElementById('test').append(myDom)
  }

</script>


</html>
